import 'package:flutter/material.dart';
import 'package:sample2/pages/samples/appbar/sliverappbar_sampe.dart';
import 'package:sample2/pages/samples/gridpaper/grid_paper_sample.dart';

class Samples extends StatefulWidget {
  const Samples({super.key});
  @override
  State<StatefulWidget> createState() {
    return SampleState();
  }
}

class SampleState extends State {
  String selectedDropdownItem = "1";

  final List<DropdownMenuItem<String>> _dropdownItems = const [
    DropdownMenuItem<String>(
      value: "1",
      child: Text("1"),
    ),
    DropdownMenuItem<String>(
      value: "2",
      child: Text("2"),
    ),
    DropdownMenuItem<String>(
      value: "3",
      child: Text("3"),
    )
  ];

  @override
  Widget build(BuildContext context) {
    return Theme(
        data: ThemeData.dark(),
        child: Scaffold(
          appBar: AppBar(
            centerTitle: false,
            title: const Text(
              "Samples",
            ),
          ),
          body: Container(
            width: MediaQuery.of(context).size.width,
            height: MediaQuery.of(context).size.height,
            decoration: const BoxDecoration(color: Colors.blueGrey),
            child: ListView(
              padding: const EdgeInsets.all(5.0),
              children: [
                Row(
                  children: [
                    const Text("DropdownButton"),
                    const Spacer(),
                    DropdownButton(
                      value: selectedDropdownItem,
                      items: _dropdownItems,
                      onChanged: (value) {
                        setState(() {
                          selectedDropdownItem = value as String;
                        });
                      },
                    )
                  ],
                ),
                TextButton(
                  onPressed: () {
                    Navigator.pushNamed(context, "/animations");
                  },
                  style: ButtonStyle(
                      side: MaterialStateProperty.all(
                          const BorderSide(color: Colors.red, width: 2.0)),
                      backgroundColor:
                          MaterialStateProperty.all(Colors.lightGreen),
                      overlayColor: MaterialStateProperty.all(Colors.red)),
                  child: const Text(
                    "Animations",
                    style: TextStyle(color: Colors.white),
                  ),
                ),
                TextButton(
                  style: ButtonStyle(
                      backgroundColor: MaterialStateProperty.resolveAs(
                          MaterialStateColor.resolveWith((states) {
                    if (states.contains(MaterialState.pressed)) {
                      return Colors.blue;
                    } else if (states.contains(MaterialState.hovered)) {
                      return Colors.pink;
                    } else {
                      return Colors.red;
                    }
                  }), {
                    MaterialState.hovered,
                    MaterialState.pressed,
                    MaterialState.focused,
                  })),
                  child: const Text(
                    "Recycle View",
                    style: TextStyle(color: Colors.white),
                  ),
                  onPressed: () {
                    Navigator.of(context).pushNamed("/recycleview");
                  },
                ),
                TextButton(
                  style: ButtonStyle(
                      backgroundColor: MaterialStateProperty.resolveAs(
                          MaterialStateColor.resolveWith((states) {
                    if (states.contains(MaterialState.pressed)) {
                      return Colors.red;
                    } else if (states.contains(MaterialState.hovered)) {
                      return Colors.pink;
                    } else {
                      return Colors.blue;
                    }
                  }), {
                    MaterialState.hovered,
                    MaterialState.pressed,
                    MaterialState.focused,
                  })),
                  child: const Text(
                    "SliverAppBar View",
                    style: TextStyle(color: Colors.white),
                  ),
                  onPressed: () {
                    Navigator.push(context,
                        MaterialPageRoute(builder: (BuildContext context) {
                      return const SliverAppBarSample();
                    }));
                  },
                ),
                TextButton(
                  style: ButtonStyle(
                      backgroundColor: MaterialStateProperty.resolveAs(
                          MaterialStateColor.resolveWith((states) {
                    if (states.contains(MaterialState.pressed)) {
                      return Colors.red;
                    } else if (states.contains(MaterialState.hovered)) {
                      return Colors.pink;
                    } else {
                      return Colors.yellow;
                    }
                  }), {
                    MaterialState.hovered,
                    MaterialState.pressed,
                    MaterialState.focused,
                  })),
                  child: const Text(
                    "WebView Sample",
                    style: TextStyle(color: Colors.black87),
                  ),
                  onPressed: () {
                    Navigator.of(context).pushNamed("/webview");
                  },
                ),
                TextButton(
                  style: ButtonStyle(
                      backgroundColor: MaterialStateProperty.resolveAs(
                          MaterialStateColor.resolveWith((states) {
                    if (states.contains(MaterialState.pressed)) {
                      return Colors.red;
                    } else if (states.contains(MaterialState.hovered)) {
                      return Colors.pink;
                    } else {
                      return const Color.fromARGB(255, 60, 188, 211);
                    }
                  }), {
                    MaterialState.hovered,
                    MaterialState.pressed,
                    MaterialState.focused,
                  })),
                  child: const Text(
                    "Grid Paper Sample",
                    style: TextStyle(color: Colors.black87),
                  ),
                  onPressed: () {
                    var pageRouter =
                        MaterialPageRoute(builder: (BuildContext context) {
                      return const GridPaperSample();
                    });
                    Navigator.of(context).push(pageRouter);
                  },
                ),
              ],
            ),
          ),
        ));
  }
}
